<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
	<head>
		<meta http-equiv="Content-Type" content="text/html;charset=UTF-8">

		<link type="text/css" rel="stylesheet" href="../../../build/fonts/fonts.css">
		<link type="text/css" rel="stylesheet" href="../../../build/reset/reset.css">
		
		<script type="text/javascript" src="../../../build/yahoo/yahoo.js"></script>
		<script type="text/javascript" src="../../../build/event/event.js" ></script>
		<script type="text/javascript" src="../../../build/dom/dom.js" ></script>

		<script type="text/javascript" src="../../../build/calendar/calendar.js"></script>
		<link type="text/css" rel="stylesheet" href="../../../build/calendar/assets/calendar.css">

		<style>
			#update { display:block; }
			#date1 { width:100px }
		</style>

		<script>
			YAHOO.namespace("example.calendar");

			function handleSelect(type,args,obj) {
				var dates = args[0]; 
				var date = dates[0];
				var year = date[0], month = date[1], day = date[2];
				
				var txtDate1 = document.getElementById("date1");
				txtDate1.value = month + "/" + day + "/" + year;
			}

			function updateCal() {
				var txtDate1 = document.getElementById("date1");

				if (txtDate1.value != "") {
					YAHOO.example.calendar.cal1.select(txtDate1.value);
					
					var firstDate = YAHOO.example.calendar.cal1.getSelectedDates()[0];
					YAHOO.example.calendar.cal1.cfg.setProperty("pagedate", (firstDate.getMonth()+1) + "/" + firstDate.getFullYear());
					
					YAHOO.example.calendar.cal1.render();
				}
			}

			// For this example page, stop the Form from being submitted, and update the cal instead
			function handleSubmit(e) {
				updateCal();
				YAHOO.util.Event.preventDefault(e);
			}

			function init() {
				YAHOO.example.calendar.cal1 = new YAHOO.widget.Calendar("cal1","cal1Container", 
																			{ mindate:"1/1/2006",
																			  maxdate:"12/31/2008" });
				YAHOO.example.calendar.cal1.selectEvent.subscribe(handleSelect, YAHOO.example.calendar.cal1, true);
				YAHOO.example.calendar.cal1.render();

				YAHOO.util.Event.addListener("update", "click", updateCal);
				YAHOO.util.Event.addListener("dates", "submit", handleSubmit);
			}

			YAHOO.util.Event.addListener(window, "load", init);
		</script>

	</head>
	<body>
		<div id="cal1Container"></div>

		<form name="dates" id="dates">
			<input type="text" name="date1" id="date1" />
			<button type="button" id="update">&lt; Update Calendar</button>
		</form>
	</body>
</html>